'use client';

import { useToast } from '@/hooks/use-toast';
import { updateCart } from '@/service/actions/cart';

export default function AddRemoveCart({
  shopId,
  productId,
  count,
}: {
  shopId: number;
  productId: number;
  count: number;
}) {
  const { toast } = useToast();
  const handleCart = async (newCount: number) => {
    const { error } = await updateCart({
      shopId,
      productId,
      count: newCount,
    });
    error && toast({ title: error.message, variant: 'destructive' });
  };
  return (
    <div className="w-16 text-center">
      {count > 0 ? (
        <div className="flex gap-3 items-center">
          <span
            onClick={() => handleCart(count - 1)}
            className="i-ri-subtract-line text-xl shrink-0 hover:scale-110 transition-transform cursor-pointer"
          />
          <span>{count}</span>
          <span
            onClick={() => handleCart(count + 1)}
            className="i-ri-add-line text-xl shrink-0 hover:scale-110 transition-transform cursor-pointer"
          />
        </div>
      ) : (
        <span
          onClick={() => handleCart(1)}
          className="i-ri-add-line text-xl shrink-0 hover:scale-110 transition-transform cursor-pointer"
        />
      )}
    </div>
  );
}
